<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="author" content="order by dede58.com"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Float-Admin</title>

    <!-- Common plugins -->
    <link href="../static/css/bootstrap.min.css" rel="stylesheet">
    <link href="../static/css/simple-line-icons.css" rel="stylesheet">
    <link href="../static/css/font-awesome.min.css" rel="stylesheet">
    <link href="../static/css/pace.css" rel="stylesheet">
    <link href="../static/css/jasny-bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="../static/css/nanoscroller.css">
    <link rel="stylesheet" href="../static/css/metismenu.min.css">
    <!--for checkbox-->
    <link href="../static/css/blue.css" rel="stylesheet">
    <!--template css-->
    <link href="../static/css/style.css" rel="stylesheet">
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="../static/js/html5shiv.min.js"></script>
    <script src="../static/js/respond.min.js"></script>
    <![endif]-->
    <style type="text/css">
        html, body {
            height: 100%;
        }
    </style>
</head>
<body>


<div class="misc-wrapper">
    <div class="misc-content">
        <div class="container">
            <div class="row">
                <div class="col-sm-6 col-sm-offset-3 col-md-4 col-md-offset-4">
                    <div class="misc-header text-center">
                        <img src="../static/css/logo.png" alt="logo" style="width: 100px;height:100px">
                    </div>
                    <div class="misc-box">
                        <p class="text-center text-uppercase pad-v" style="font-size: 20px">Login</p>

                        <div class="form-group">
                            <label class="text-muted" for="phoneNumber">手机号</label>
                            <div class="group-icon">
                                <input id="phoneNumber" type="text" placeholder="请输入手机号" class="form-control"
                                       required="">
                                <span class="icon-user text-muted icon-input"></span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="text-muted" for="password">密码</label>
                            <div class="group-icon">
                                <input id="password" type="password" placeholder="请输入密码" class="form-control">
                                <span class="icon-lock text-muted icon-input"></span>
                            </div>
                        </div>
                        <div class="clearfix">
                            <div class="pull-left">
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" class="i-checks" name="remember">
                                        <span>记住密码</span></label>
                                </div>
                            </div>
                            <div class="pull-right">
                                <button type="submit" onclick="login()" class="btn btn-block btn-primary">登录</button>
                            </div>
                        </div>
                        <hr>
                        <p class=" text-center">需要注册？</p>
                        <a href="WEB-INF/menu/page-register.html" class="btn btn-block btn-default">前往注册</a>

                    </div>
                    <div class="text-center misc-footer">
                        <span>&copy; Copyright 2016 - 2017. Float Admin<br>Bootstrap admin template</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!--Common plugins-->
<script src="../static/js/jquery.min.js"></script>
<script src="../static/js/bootstrap.min.js"></script>
<script src="../static/js/jasny-bootstrap.min.js"></script>
<script src="../static/js/jquery.slimscroll.min.js"></script>
<script src="../static/js/jquery.nanoscroller.min.js"></script>
<!--ichecks-->
<script src="../static/js/icheck.min.js"></script>
<script>
    $(document).ready(function () {
        $('.i-checks').iCheck({
            checkboxClass: 'icheckbox_square-blue',
            radioClass: 'iradio_square-blue'
        });
    });

    function login() {
        var name = $("#phoneNumber").val();
        var pass = $("#password").val();
        let data = {"phoneNumber": name, "password": pass};
        if (name === "" || pass === "") {
            alert("账号密码不可为空")
            return false;
        }

        $.ajax({
            url: "login",
            data: JSON.stringify(data),
            type: "post",
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            success: function (res) {
                if (res.code === 200) {
                    window.location.href = 'toForestDecorateHome'
                } else {
                    alert(res.msg)
                }
            }, error: function () {
                alert("出错了")
            }
        })

    }
</script>
</body>
</html>
